<template>
  <div class="searchmain">
    <PullRefresh @refresh="updateItems">
      <div slot="pullRefreshSlot">
        <van-list
          v-model="loading"
          :finished="finished"
          :finished-text="$t('lang.已经到底了')"
          :error.sync="error"
          :error-text="this.$t('lang.请求失败，点击重新加载')"
          @load="onLoad"
          v-if="items.length > 0"
        >
          <div class="searchmain_list">
            <div class="searchmain_list_tags">
              <Tags :items="tags" :isClose="isClose"></Tags>
            </div>
            <RecommendUser
              :items="$store.state.user"
              :showTip="showTip"
            ></RecommendUser>
            <TwoColumnList :items="items">
              <div slot="twoColumnItem" slot-scope="{ item }">
                <router-link
                  :to="{
                    name: 'CONTENT',
                    params: {
                      contentid: item.contentId,
                      usid: item.userId,
                    },
                  }"
                >
                  <ColumnItem :item="item.content[0]"></ColumnItem
                ></router-link>
              </div>
            </TwoColumnList>
          </div>
        </van-list>
        <div v-else class="nodata">
          <NoContent :type="noContentType"></NoContent>
        </div>
      </div>
    </PullRefresh>
    <!-- <van-pull-refresh
      v-model="isLoading"
      @refresh="onRefresh"
      :pulling-text="this.$t('lang.下拉即可刷新')"
      :loosing-text="this.$t('lang.释放即可刷新')"
      :loading-text="this.$t('lang.加载中')"
      >
      <van-list
        v-model="loading"
        :finished="finished"
        :finished-text="$t('lang.已经到底了')"
        :error.sync="error"
        :error-text="this.$t('lang.请求失败，点击重新加载')"
        @load="onLoad"
        v-if="items.length > 0"
      >
        <div class="searchmain_list">
          <div class="searchmain_list_tags">
            <Tags :items="tags" :isClose="isClose"></Tags>
          </div>
          <RecommendUser
            :items="$store.state.user"
            :showTip="showTip"
          ></RecommendUser>
          <TwoColumnList :items="items">
            <div slot="twoColumnItem" slot-scope="{ item }">
              <router-link
                :to="{
                  name: 'CONTENT',
                  params: {
                    contentid: item.contentId,
                    usid: item.userId,
                  },
                }"
              >
                <ColumnItem :item="item.content[0]"></ColumnItem
              ></router-link>
            </div>
          </TwoColumnList>
        </div>
      </van-list>
      <div v-else class="nodata">
        <NoContent :type="noContentType"></NoContent>
      </div>
    </van-pull-refresh> -->
  </div>
</template>
<script>
export default {
  name: "SearchMain",
  components: {
    PullRefresh: () =>
      import(
        /* webpackChunkName:"pullRefresh" */ "../../components/common/pullRefresh.vue"
      ),
    TwoColumnList: () =>
      import(
        /* webpackChunkName: "twoColumnList" */ "../../components/common/twoColumnList"
      ),
    ColumnItem: () =>
      import(
        /* webpackChunkName: "columnItem" */ "../../components/common/columnItem"
      ),
    NoContent: () =>
      import(
        /* webpackChunkName:"noContent" */ "../../components/common/noContent.vue"
      ),
    RecommendUser: () =>
      import(
        /* webpackChunkName:"recommendUser" */ "../../components/common/recommendUser.vue"
      ),
    Tags: () =>
      import(/* webpackChunkName:"tags" */ "../../components/common/tags.vue"),
  },
  data() {
    return {
      tags: ["早晨", "asdfasdf", "电影", "娱乐自己", "标签测试", "线上测试"],
      items: [],
      isLoading: false,
      loading: false,
      finished: true,
      error: false,
      noContentType: 10,
      isClose: false,
      showTip: false,
    };
  },
  created() {
    this.updateItems(1).then(() => {});
  },
  methods: {
    updateItems(pageNum, callback) {
      let that = this;
      return new Promise((resolve, reject) => {
        that.items = [
          {
            userId: "0123456",
            userHead:
              "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595233833221&di=8cf8621bb5bdae4844362dfe99c54191&imgtype=0&src=http%3A%2F%2Fb.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2Fbd315c6034a85edf8c1758e240540923dc547553.jpg",
            nickName: "undefined",
            position: "中国",
            isNewContent: true,
            contentId: "0123456",
            content: [
              {
                contentId: "0123456",
                type: "image",
                url:
                  "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595404846560&di=048aa78392e72139da3bf53e919a3487&imgtype=0&src=http%3A%2F%2Fsociety.people.com.cn%2FNMediaFile%2F2012%2F1225%2FMAIN201212250817000391741949828.jpg",
              },
            ],
          },
          {
            userId: "0123456",
            userHead:
              "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595233833221&di=8cf8621bb5bdae4844362dfe99c54191&imgtype=0&src=http%3A%2F%2Fb.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2Fbd315c6034a85edf8c1758e240540923dc547553.jpg",
            nickName: "undefined",
            position: "中国",
            isNewContent: true,
            contentId: "0123456",
            content: [
              {
                contentId: "0123456",
                type: "image",
                url:
                  "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595404846560&di=048aa78392e72139da3bf53e919a3487&imgtype=0&src=http%3A%2F%2Fsociety.people.com.cn%2FNMediaFile%2F2012%2F1225%2FMAIN201212250817000391741949828.jpg",
              },
            ],
          },
          {
            userId: "0123456",
            userHead:
              "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595233833221&di=8cf8621bb5bdae4844362dfe99c54191&imgtype=0&src=http%3A%2F%2Fb.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2Fbd315c6034a85edf8c1758e240540923dc547553.jpg",
            nickName: "undefined",
            position: "中国",
            isNewContent: true,
            contentId: "0123456",
            content: [
              {
                contentId: "0123456",
                type: "image",
                url:
                  "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595404846560&di=048aa78392e72139da3bf53e919a3487&imgtype=0&src=http%3A%2F%2Fsociety.people.com.cn%2FNMediaFile%2F2012%2F1225%2FMAIN201212250817000391741949828.jpg",
              },
            ],
          },
          {
            userId: "0123456",
            userHead:
              "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595233833221&di=8cf8621bb5bdae4844362dfe99c54191&imgtype=0&src=http%3A%2F%2Fb.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2Fbd315c6034a85edf8c1758e240540923dc547553.jpg",
            nickName: "undefined",
            position: "中国",
            isNewContent: true,
            contentId: "0123456",
            content: [
              {
                contentId: "0123456",
                type: "image",
                url:
                  "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595404846560&di=048aa78392e72139da3bf53e919a3487&imgtype=0&src=http%3A%2F%2Fsociety.people.com.cn%2FNMediaFile%2F2012%2F1225%2FMAIN201212250817000391741949828.jpg",
              },
            ],
          },
          {
            userId: "0123456",
            userHead:
              "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595233833221&di=8cf8621bb5bdae4844362dfe99c54191&imgtype=0&src=http%3A%2F%2Fb.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2Fbd315c6034a85edf8c1758e240540923dc547553.jpg",
            nickName: "undefined",
            position: "中国",
            isNewContent: true,
            contentId: "0123456",
            content: [
              {
                contentId: "0123456",
                type: "image",
                url:
                  "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595404846560&di=048aa78392e72139da3bf53e919a3487&imgtype=0&src=http%3A%2F%2Fsociety.people.com.cn%2FNMediaFile%2F2012%2F1225%2FMAIN201212250817000391741949828.jpg",
              },
            ],
          },
          {
            userId: "0123456",
            userHead:
              "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595233833221&di=8cf8621bb5bdae4844362dfe99c54191&imgtype=0&src=http%3A%2F%2Fb.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2Fbd315c6034a85edf8c1758e240540923dc547553.jpg",
            nickName: "undefined",
            position: "中国",
            isNewContent: true,
            contentId: "0123456",
            content: [
              {
                contentId: "0123456",
                type: "image",
                url:
                  "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595404846560&di=048aa78392e72139da3bf53e919a3487&imgtype=0&src=http%3A%2F%2Fsociety.people.com.cn%2FNMediaFile%2F2012%2F1225%2FMAIN201212250817000391741949828.jpg",
              },
            ],
          },
          {
            userId: "0123456",
            userHead:
              "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595233833221&di=8cf8621bb5bdae4844362dfe99c54191&imgtype=0&src=http%3A%2F%2Fb.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2Fbd315c6034a85edf8c1758e240540923dc547553.jpg",
            nickName: "undefined",
            position: "中国",
            isNewContent: true,
            contentId: "0123456",
            content: [
              {
                contentId: "0123456",
                type: "image",
                url:
                  "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595404846560&di=048aa78392e72139da3bf53e919a3487&imgtype=0&src=http%3A%2F%2Fsociety.people.com.cn%2FNMediaFile%2F2012%2F1225%2FMAIN201212250817000391741949828.jpg",
              },
            ],
          },
          {
            userId: "0123456",
            userHead:
              "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595233833221&di=8cf8621bb5bdae4844362dfe99c54191&imgtype=0&src=http%3A%2F%2Fb.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2Fbd315c6034a85edf8c1758e240540923dc547553.jpg",
            nickName: "undefined",
            position: "中国",
            isNewContent: true,
            contentId: "0123456",
            content: [
              {
                contentId: "0123456",
                type: "image",
                url:
                  "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595404846560&di=048aa78392e72139da3bf53e919a3487&imgtype=0&src=http%3A%2F%2Fsociety.people.com.cn%2FNMediaFile%2F2012%2F1225%2FMAIN201212250817000391741949828.jpg",
              },
            ],
          },
          {
            userId: "0123456",
            userHead:
              "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595233833221&di=8cf8621bb5bdae4844362dfe99c54191&imgtype=0&src=http%3A%2F%2Fb.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2Fbd315c6034a85edf8c1758e240540923dc547553.jpg",
            nickName: "undefined",
            position: "中国",
            isNewContent: true,
            contentId: "0123456",
            content: [
              {
                contentId: "0123456",
                type: "image",
                url:
                  "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595404846560&di=048aa78392e72139da3bf53e919a3487&imgtype=0&src=http%3A%2F%2Fsociety.people.com.cn%2FNMediaFile%2F2012%2F1225%2FMAIN201212250817000391741949828.jpg",
              },
            ],
          },
          {
            userId: "0123456",
            userHead:
              "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595233833221&di=8cf8621bb5bdae4844362dfe99c54191&imgtype=0&src=http%3A%2F%2Fb.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2Fbd315c6034a85edf8c1758e240540923dc547553.jpg",
            nickName: "undefined",
            position: "中国",
            isNewContent: true,
            contentId: "0123456",
            content: [
              {
                contentId: "0123456",
                type: "image",
                url:
                  "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595404846560&di=048aa78392e72139da3bf53e919a3487&imgtype=0&src=http%3A%2F%2Fsociety.people.com.cn%2FNMediaFile%2F2012%2F1225%2FMAIN201212250817000391741949828.jpg",
              },
            ],
          },
        ];
        callback && callback();
        resolve();
      });
    },
    onLoad() {},
  },
};
</script>
<style lang="less">
@base: 23.44rem;
.searchmain {
  overflow: hidden;
  display: block;
  .searchmain_list {
    overflow: hidden;
    .searchmain_list_tags {
      padding: 20 / @base;
      border-bottom: 1 / @base solid #efefef;
      margin: 0 0 10 / @base 0;
      overflow: hidden;
    }
  }
}
</style>
